class DrawHandler {
    _shapeKey = null;
    _isDrawing = false;
    _drawStartPointer = {
        x: 0,
        y: 0
    };
    _drawEndPointer = {
        x: 0,
        y: 0
    };
    _isDrawingObj = null;
    _isDrawingUpdateFunc = null;
    constructor(c) {
        this._canvas = c;
        this.initEvent();
    }

    setShape = (key) => {
        this._shapeKey = key;
    }

    initEvent = () => {
        /* this._canvas.add(
            new fabric.Rect({ top: 100, left: 100, width: 50, height: 50, fill: '#f55' }),
            new fabric.Circle({ top: 140, left: 230, radius: 75, fill: 'green' }),
            new fabric.Triangle({ top: 300, left: 210, width: 100, height: 100, fill: 'blue' })
        ); */

        this._canvas.on('mouse:down', (e) => {
            let classHandler = null;            
            switch(this._shapeKey) {
                case 'rectangle': {
                    classHandler = fabric.Rect;
                    this.isDrawingUpdateFunc = (endX, endY) => {
                        let width = endX - this._drawStartPointer.x;
                        let height = endY - this._drawStartPointer.y;
                        this._isDrawingObj.width = width;
                        this._isDrawingObj.height = height;
                    };
                    break;
                }
                case 'circle': {
                    classHandler = fabric.Circle;
                    this.isDrawingUpdateFunc = (endX, endY) => {
                        let width = endX - this._drawStartPointer.x;
                        let height = endY - this._drawStartPointer.y;

                        let minLength = Math.min(Math.abs(width), Math.abs(height));
                        let radius = minLength / 2;
                        this._isDrawingObj.left = this._drawStartPointer.x + (width > 0 ? radius : -radius);
                        this._isDrawingObj.top = this._drawStartPointer.y + (height > 0 ? radius : -radius);
                        this._isDrawingObj.radius = radius;
                    };
                    break;
                }
                case 'triangle': {
                    classHandler = fabric.Triangle;
                    this.isDrawingUpdateFunc = (endX, endY) => {
                        let width = endX - this._drawStartPointer.x;
                        let height = endY - this._drawStartPointer.y;
                        this._isDrawingObj.width = width;
                        this._isDrawingObj.height = height;
                    };
                    break;
                }
            }
            if (classHandler !== null) {
                this._drawStartPointer.x = e.absolutePointer.x;
                this._drawStartPointer.y = e.absolutePointer.y;
                this._isDrawing = true;
                this._isDrawingObj = new classHandler({
                    left: this._drawStartPointer.x,
                    top: this._drawStartPointer.y,
                    width: 0,
                    height: 0,
                    fill: null,
                    stroke: 'red',
                    strokeWidth: 2,
                    selectable: false
                });
                this._canvas.selection = false;
                this._canvas.add(this._isDrawingObj);
            }
            
        });

        this._canvas.on('mouse:move', (e) => {
            if (this._isDrawing == true) {
                this.isDrawingUpdateFunc(e.absolutePointer.x, e.absolutePointer.y);
                this._canvas.requestRenderAll();
            }
        });

        this._canvas.on('mouse:up', (e) => {
            if (this._isDrawing === true) {
                this._isDrawing = false;
                this._isDrawingObj = null;
                this._canvas.selection = true;
                this._shapeKey = null;
            }
        });
    }
}

export {DrawHandler};